<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/1/12
  Time: 13:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="webroot" value="${pageContext.request.contextPath}"/>
<html>
<head>
    <title>${title}</title>
    <script src="${webroot}/element/vue.js"></script>
    <link rel="stylesheet" href="${webroot}/element/index.css">
    <script src="${webroot}/element/index.js"></script>
    <link rel="stylesheet" type="text/css" href="${webroot}/styles/basc.css">
</head>

<body>
<div id="app">
    <%@ include file="../includes/hear.jsp" %>
    <div style="float: left;width: 200px;">
        <%@ include file="../includes/menu.jsp" %>
    </div>
    <div style="float: left;width: 800px;">
        <div class="operation" style="margin-left: 10px;margin-bottom: 10px;padding-top: 10px;">验证信息↓：<span class="mess"
                                                                                        id="infoMess">${sessionScope.infoMess}</span>
        </div>
        <el-form ref="form" :model="form" style="margin-left: 50px;">
            <el-form-item label="登录账号">
                <el-input v-model="form.username" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="员工姓名">
                <el-input v-model="form.ename" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="身份证号">
                <el-input v-model="form.idcode" placeholder="15或18位身份证号" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="性　　别">
                <el-radio-group v-model="form.ssex">
                    <el-radio label="男" ></el-radio>
                    <el-radio label="女"></el-radio>
                </el-radio-group>
            </el-form-item>

            <el-form-item label="民　　族">
                <el-input v-model="form.nation" placeholder="例如：汉族" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="政治面貌">
                <el-select v-model="form.political" placeholder="请选择政治面貌">
                    <el-option label="群众" value="群众"></el-option>
                    <el-option label="团员" value="团员"></el-option>
                    <el-option label="党员" value="党员"></el-option>
                </el-select>
            </el-form-item>

            <el-form-item label="出生日期">
                <el-input v-model="form.birthday" placeholder="XXXX-XX-XX" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="家庭住址">
                <el-input v-model="form.homeaddr" placeholder="XX省XX市XX县XX街道XX号" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="手机号　">
                <el-input v-model="form.mobile" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="邮　　编">
                <el-input v-model="form.zipcode" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="备用联系地址">
                <el-input v-model="form.conaddr" placeholder="XX省XX市XX县XX街道XX号" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item label="备用联系人">
                <el-input v-model="form.receiver" style="width: 350px;"></el-input>
            </el-form-item>

            <el-form-item>
                <el-button type="primary" @click="onSubmit">立即提交</el-button>
                <el-button @click="resetForm('form')">重置</el-button>
            </el-form-item>
        </el-form>

    </div>
</div>
</body>
<STYLE>
    #app {
        width: 1280px;
        margin: 0 auto;
    }
</STYLE>
<script>
    new Vue({
        el: '#app',
        data: {
            form: {
                username: '',
                ename: '',
                idcode: '',
                nation: '',
                ssex: '男',
                homeaddr: '',
                zipcode: '',
                conaddr: '',
                receiver: '',
                birthday: '',
                political: '',
                mobile: '',
            }
        },
        methods: {
            onSubmit() {
                var em_info = {
                    username: this.form.username,
                    ename: this.form.ename,
                    idcode: this.form.idcode,
                    nation: this.form.nation,
                    ssex: this.form.ssex,
                    homeaddr: this.form.homeaddr,
                    zipcode: this.form.zipcode,
                    conaddr: this.form.conaddr,
                    receiver: this.form.receiver,
                    birthday: this.form.birthday,
                    political: this.form.political,
                    mobile: this.form.mobile,
                }
                window.location.href = '${webroot}/man_add.do?em_info=' + JSON.stringify(em_info);
            },
            resetForm(form) {
                this.$refs[form].resetFields();
            }
        },
    })
</script>
</html>
